<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path +"/";
%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <base href="<%= basePath %>"/>
    <title>财务管理</title>
    <style>
        body {
            margin: 0;
            font-family: 'Segoe UI', 'Arial', sans-serif;
            background: #f5f6fa;
        }
        .header {
            background: #4f8cff;
            color: #fff;
            padding: 24px 0 18px 0;
            text-align: center;
            font-size: 2rem;
            font-weight: bold;
            letter-spacing: 2px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.04);
        }
        .nav {
            display: flex;
            justify-content: center;
            background: #fff;
            box-shadow: 0 2px 8px rgba(0,0,0,0.04);
        }
        .nav a {
            padding: 18px 40px;
            color: #4f8cff;
            text-decoration: none;
            font-size: 1.15rem;
            transition: background 0.2s, color 0.2s;
            border-bottom: 3px solid transparent;
            cursor: pointer;
        }
        .nav a:hover, .nav a.active {
            background: #f0f4ff;
            color: #357ae8;
            border-bottom: 3px solid #4f8cff;
        }
        .iframe-container {

            display: flex;
            justify-content: center;
            margin-top: 40px;
        }
        iframe {

            width: 100%;
            max-width: 1700px;
            height: 750px;
            border: none;
            border-radius: 12px;
            box-shadow: 0 4px 24px rgba(0,0,0,0.06);
            background: #fff;
        }
    </style>
    <script>
        window.onload = function() {
            var links = document.querySelectorAll('.nav a');
            var iframe = document.getElementById('mainFrame');
            links.forEach(function(link) {
                link.addEventListener('click', function(e) {
                    e.preventDefault();
                    links.forEach(function(l) { l.classList.remove('active'); });
                    this.classList.add('active');
                    iframe.src = this.getAttribute('data-src');
                });
            });
        };
    </script>
</head>
<body>
    <div class="header">财务管理</div>
    <div class="nav">
        <a href="#" class="active" data-src="property_income">收入管理</a>
        <a href="#" data-src="property_pay">支出管理</a>
        <a href="#" data-src="FinancialStatements">财务报表</a>
    </div>
    <div class="iframe-container">
        <iframe id="mainFrame" src="property_income"></iframe>
    </div>
</body>
</html>